.a{
    border: red solid 3px;
    height: 80px;
    width: 80px;
    float: left;
    filter: blur(20px);
    box-shadow: 12px 2px 5px yellow;
    background: repeating-linear-gradient(red,yellow,black);
}
@keyframes texiao{

    0%{
        background: repeating-linear-gradient(green,pink,blue);
        height: 200px;
    }
    50%{
        background: repeating-linear-gradient(red,yellow,black);
        height: 200px;
    }
    100%{
        background: repeating-linear-gradient(red,pink,yellow);
        height: 200px;
    }
}

.a{
    height: 200px;
    width: 200px;
    
    
}
.a:hover{
    background-color: blueviolet;
    animation: texiao 200ms;
    animation-iteration-count: 2;

}